<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    
    <title>post | conci</title>
    <meta name="description" content="今天通过一个简单的列子来演示怎么在npm发布自己的包。 你需要先下载安装node.js发布包 新建个文件夹，这里命名为test110，， 然后再在test110下新建一个lib文件夹。 创建package.json,在test110文件夹下，右键选择git bash here输入命令1npm init   然后name输入test110，然后一路回车，最后ctrl + c结束,  创建readme">
<meta name="keywords" content="javascript,npm,node.js">
<meta property="og:type" content="article">
<meta property="og:title" content="在npm发布一个自己的包">
<meta property="og:url" content="http://www.ccblog.win/2017/07/17/在npm发布一个自己的包/index.html">
<meta property="og:site_name" content="cc">
<meta property="og:description" content="今天通过一个简单的列子来演示怎么在npm发布自己的包。 你需要先下载安装node.js发布包 新建个文件夹，这里命名为test110，， 然后再在test110下新建一个lib文件夹。 创建package.json,在test110文件夹下，右键选择git bash here输入命令1npm init   然后name输入test110，然后一路回车，最后ctrl + c结束,  创建readme">
<meta property="og:updated_time" content="2017-07-17T11:48:43.115Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="在npm发布一个自己的包">
<meta name="twitter:description" content="今天通过一个简单的列子来演示怎么在npm发布自己的包。 你需要先下载安装node.js发布包 新建个文件夹，这里命名为test110，， 然后再在test110下新建一个lib文件夹。 创建package.json,在test110文件夹下，右键选择git bash here输入命令1npm init   然后name输入test110，然后一路回车，最后ctrl + c结束,  创建readme">
    
        <link rel="alternate" href="true" title="cc" type="application/atom+xml">
    
    
        <link rel="icon" href="/favicon.ico">
    
    <link rel="stylesheet" href="/css/concise.css">
    <script src="/js/concise.js"></script>
    <script>
        (function(){
            var useragent=navigator.userAgent;
            console.log(navigator,useragent);
            var isM;
            if(useragent.indexOf('iPhone')!=-1){
                isM=true;
            }else if(useragent.indexOf('Android ')!=-1){
                isM=true;
            }else if(useragent.indexOf('iPad')!=-1){
                isM=true;
            }else{
                isM=false;
            }
            if(isM){
                document.documentElement.style.fontSize=document.documentElement.clientWidth/375*100+'px';
                window.onresize=function(){
                    document.documentElement.style.fontSize=document.documentElement.clientWidth/375*100+'px';
                };
            }
        })();
    </script>
    
        <script type="text/javascript" id="hexo.configuration">
            var CONFIG = {
                root: '/',
                algolia: {
                    applicationID: '148WKKLBJ2',
                    apiKey: '1b27867f0ba7ad358543a84d6d30bcb3',
                    indexName: 'test',
                    hits: {
                        per_page: ''
                    },
                    labels: {
                        input_placeholder: '请输入要搜索的字段...',
                        hits_empty: '没有查找到和 「${query}」相关的内容',
                        hits_stats: '总共${hits} 条相关条目，使用了 ${time} 毫秒'
                    }
                }
            };
        </script>
    
    <script src="http://opu30aljn.bkt.clouddn.com/jquery.js"></script>
    
        <script src="http://opu30aljn.bkt.clouddn.com/instantsearch.js"></script>
        <script src="/js/thirdparty/algolia.js"></script>
    
    <script src="/js/script.js"></script>
</head>
<body>
<input type="checkbox" id="left-information">
<div id="wrapper">
    <div id="bgg"></div>
    <header id="header">
    <nav id="nav" class="clearfix">
        <label for="left-information"></label>
        <ul class='nav-left'>
            <li><a href="/">ccblog</a></li>
        </ul>
        <input type="checkbox" id="header-right-nav">
        <ul class="clearfix nav-right">
            
            <li><a href="/">Home</a></li>
            
            <li><a href="/about">About</a></li>
            
            <li><a href="/contact">Contact</a></li>
            
            <li><a href="/archives">Archives</a></li>
            
            <li><a href="/tags">tags</a></li>
            
        </ul>
        <label for="header-right-nav"><i></i></label>
    </nav>
</header>
    <article id="logo">
    <div id="logo-content">
        <header>
            <a href="">cc&#39;s .blog<b>conci</b></a>
        </header>
        <p>
            conci theme 1.0.0<br>
            Simple and practical hexo personal blog theme.<br>
            The freedom to choose
        </p>
    </div>
</article>
    <div id="main" class="clearfix">
        <section id="main-left" class="left">
            <article id="post">
    <h1>在npm发布一个自己的包</h1>
    <p>
        
            <span class="visitors">visitors
                <span id="/2017/07/17/在npm发布一个自己的包/" class="leancloud_visitors" data-flag-title="在npm发布一个自己的包">
                    <span class="leancloud-visitors-count">0</span>
                </span>
            </span>&nbsp;&nbsp;•&nbsp;&nbsp;
        
        
            <span class="tag">
                  <a class="article-category-link" href="/categories/npm/">npm</a>
            </span>&nbsp;&nbsp;•&nbsp;&nbsp;
        
        <span class="date">2017.07.17</span>
    </p>
    <div id="page-post-content">
        <p>今天通过一个简单的列子来演示怎么在npm发布自己的包。</p>
<h3 id="你需要先下载安装node-js"><a href="#你需要先下载安装node-js" class="headerlink" title="你需要先下载安装node.js"></a>你需要先下载安装<a href="https://nodejs.org/" target="_blank" rel="external">node.js</a></h3><h3 id="发布包"><a href="#发布包" class="headerlink" title="发布包"></a>发布包</h3><ol>
<li>新建个文件夹，这里命名为test110，，</li>
<li>然后再在test110下新建一个lib文件夹。</li>
<li>创建package.json,在test110文件夹下，右键选择git bash here输入命令<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm init</div></pre></td></tr></table></figure>
</li>
</ol>
<p>然后<code>name</code>输入<code>test110</code>，然后一路回车，最后<code>ctrl + c</code>结束,</p>
<ol>
<li>创建readme.md文件，在test110文件夹下,在新建一个readme.md文件（这是一个介绍你包的文件makdown文件），随便输入点什么，如<code>这是我的第一个npm包</code>。</li>
<li><p>在lib文件夹下新建新建一个test.js文件，输入如下代码</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div></pre></td><td class="code"><pre><div class="line">var a = &#123;</div><div class="line">    fu : function() &#123;</div><div class="line">        console.log( &apos;这是我的第一个npm包&apos; );</div><div class="line">    &#125;;</div><div class="line">    module.exports = a; // 把a暴漏出去</div><div class="line">&#125;</div></pre></td></tr></table></figure>
</li>
<li><p>在test110文件夹下新建一个index.js文件（主入口文件），输入</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div></pre></td><td class="code"><pre><div class="line">var a = require( &apos;./lib/test.js&apos; );</div><div class="line">module.exports = a; //把a暴漏出去</div></pre></td></tr></table></figure>
</li>
<li><p>包文件已经ok,结构如下</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div><div class="line">3</div><div class="line">4</div><div class="line">5</div><div class="line">6</div></pre></td><td class="code"><pre><div class="line">-test110</div><div class="line">    -lib</div><div class="line">        -test.js</div><div class="line">    -index.js</div><div class="line">    -package.json</div><div class="line">    -readme.md</div></pre></td></tr></table></figure>
</li>
<li><p>创建npm账号，两种方式<br> 一种:登录 <a href="https://www.npmjs.com/" target="_blank" rel="external">https://www.npmjs.com/</a> 注册<br> 第二种：命令行注册，输入如下</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm adduser</div></pre></td></tr></table></figure>
</li>
</ol>
<p>依次输入用户名，密码，邮箱就注册成功了。注册成功会自动登录，所以现在已经在本地登录成功。<br>如果你已经有npm账号可通过与哦如下命名登录，<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm login</div></pre></td></tr></table></figure></p>
<p>输入用户名，密码就可登陆成功。</p>
<ol>
<li>发布包，在test110文件夹下，右键选择git bash here输入命令，输入如下命令<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm publish</div></pre></td></tr></table></figure>
</li>
</ol>
<p>就可发布成功，注意发布必须是登录状态下。</p>
<ol>
<li>这时你就可以在npm官网 <a href="https://www.npmjs.com/" target="_blank" rel="external">https://www.npmjs.com/</a> , 在搜索框中输入<code>test110</code>,查询到你刚才发布的包了。</li>
<li>更新包，你修改过包里的js文件时，同时还得修改package.json里version的版本号后才可重新发布。</li>
</ol>
<h3 id="应用包"><a href="#应用包" class="headerlink" title="应用包"></a>应用包</h3><ol>
<li><p>这时你新建个文件夹（如test）就可以通过以下命令下载你发布的包了</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">npm install test110</div></pre></td></tr></table></figure>
</li>
<li><p>然后，在test文件夹下新建in.js文件，输入如下代码</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div><div class="line">2</div></pre></td><td class="code"><pre><div class="line">var test110 = require( &apos;test110&apos; );</div><div class="line">test110.fu();</div></pre></td></tr></table></figure>
</li>
<li><p>在test文件夹,右键选择git bash here输入命令，输入如下命令</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><div class="line">1</div></pre></td><td class="code"><pre><div class="line">node in.js</div></pre></td></tr></table></figure>
</li>
</ol>
<p>就可以输出<code>这是我的第一个npm包</code></p>

    </div>
    
        <div id="page-post-tags">
              <a class="article-tag-link" href="/tags/javascript/">javascript</a>&nbsp;/&nbsp;<a class="article-tag-link" href="/tags/node-js/">node.js</a>&nbsp;/&nbsp;<a class="article-tag-link" href="/tags/npm/">npm</a>
        </div>
    
    
        <div id="page-post-reward">
            <label for="page-post-inp">打赏</label>
            <input type="checkbox" id="page-post-inp">
            <ul class="clearfix">
                <li>
                    <a href="javascript:void(0);">
                        <img src="http://ooa3lxrpg.bkt.clouddn.com/wx.jpg?imageView2/2/w/180">
                    </a>
                    <p>微信</p>
                </li>
                <li>
                    <a href="javascript:void(0);">
                        <img src="http://ooa3lxrpg.bkt.clouddn.com/zfb.jpg?imageView2/2/w/180">
                    </a>
                    <p>支付宝</p>
                </li>
            </ul>
        </div>
    
    
<nav id="article-nav" class="clearfix">
  
    <a href="/2017/06/27/不用下载第三方软件，快速搭建一个本地服务/" id="article-nav-newer" class="article-nav-link-wrap">
      <strong class="article-nav-caption">上一篇</strong>
      <div class="article-nav-title">
        
          
          不用下载第三方软件，快速搭建一个本地服务
        
      </div>
    </a>
  
  
</nav>

</article>


<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"slide":{"type":"slide","bdImg":"4","bdPos":"left","bdTop":"100"},"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到：","viewSize":"32"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>



<div id="cloud-tie-wrapper" class="cloud-tie-wrapper"></div>
<script src="https://img1.cache.netease.com/f2e/tie/yun/sdk/loader.js"></script>
<script>
    var cloudTieConfig = {
        url: document.location.href,
        sourceId: '',
        productKey: '6f0492a87f74476e9df370e5e7ce2270',
        target: 'cloud-tie-wrapper'
    };
    var yunManualLoad = true;
    Tie.loader('aHR0cHM6Ly9hcGkuZ2VudGllLjE2My5jb20vcGMvbGl2ZXNjcmlwdC5odG1s', true);
</script>



        </section>
        <section id="main-right" class="right">
            <div class="my">
    <div class="my-information">
        <div class="my-img">
            <img src="http://ooa3lxrpg.bkt.clouddn.com/b.jpg?imageView2/1/w/120/h/120/q/75" rel="图片">
            <a href="https://github.com/cspp01"></a>
        </div>
        <span>cc</span>
        <p>求知若饥 虚心若愚</p>
    </div>
    <p class="my-social">
        
            <a href="https://github.com/cspp01" class="my-social-me5">github</a>
        
            <a href="/" class="my-social-me2">twitter</a>
        
            <a href="http://weibo.com/5262373626/profile?topnav=1&wvr=6&is_all=1" class="my-social-me2">weibo</a>
        
            <a href="http://douban.com/people/160374034/" class="my-social-me2">豆瓣</a>
        
            <a href="http://www.zhihu.com/people/cc-chen-4-85" class="my-social-me1">知乎</a>
        
    </p>
    <div class="my-post">
        <a href="/archives">
            <strong>19</strong><br>
            <span>posts</span>
        </a>
        <a href="/categories">
            <strong>11</strong><br>
            <span>categories</span>
        </a>
        <a href="/tags">
            <strong>21</strong><br>
            <span>tags</span>
        </a>
    </div>
    <div class="search-rss">
        <div class="my-search">
            <a href="javascript:void(0)" id ='my-search-a' class="popup-trigger">search</a>
        </div>
        
            <div class="my-rss">
                <a href="/atom.xml">rss</a>
            </div>
        
    </div>
    <div class="my-links">
        <ul class="clearfix">
            
            <li>
                <a href="/">
                    <img src="http://ooa3lxrpg.bkt.clouddn.com/timg.jpg">
                    <p>ccblog</p>
                </a>
            </li>
            
            <li>
                <a href="/">
                    <img src="http://ooa3lxrpg.bkt.clouddn.com/timg%20%282%29.jpg">
                    <p>boc</p>
                </a>
            </li>
            
            <li>
                <a href="/">
                    <img src="http://ooa3lxrpg.bkt.clouddn.com/timg%20%283%29.jpg">
                    <p>haha</p>
                </a>
            </li>
            
            <li>
                <a href="/">
                    <img src="http://ooa3lxrpg.bkt.clouddn.com/timg%20%283%29.jpg">
                    <p>pp</p>
                </a>
            </li>
            
            <li>
                <a href="/">
                    <img src="http://ooa3lxrpg.bkt.clouddn.com/timg%20%281%29.jpg">
                    <p>oop</p>
                </a>
            </li>
            
        </ul>
    </div>
    <div class="hot-page">
        
    </div>
</div>
            
            <div id="warehouse"></div>
            
        </section>
    </div>
    <footer id="footer">
    <p>© 2017  cc | <iframe src="https://ghbtns.com/github-btn.html?user=cspp01&repo=cspp01.github.io&type=star&count=true" >
        </iframe><br/>
        concise theme, this world is mine.  | cc'blog | Fork me on Github
        
            | <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1261969111'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s19.cnzz.com/z_stat.php%3Fid%3D1261969111%26show%3Dpic' type='text/javascript'%3E%3C/script%3E"));</script>
        
    </p>
</footer>
</div>
<label for="left-information"></label>


    <div class="site-search">
        <div class="algolia-popup popup">
            <div class="algolia-search">
                <div class="algolia-search-input-icon">
                    <i class="fa fa-search"></i>
                </div>
                <div class="algolia-search-input" id="algolia-search-input"></div>
            </div>

            <div class="algolia-results">
                <div id="algolia-stats"></div>
                <div id="algolia-hits"></div>
                <div id="algolia-pagination" class="algolia-pagination"></div>
            </div>

            <span class="popup-btn-close">
          <i class="fa fa-times-circle"></i>
        </span>
        </div>
    </div>


<script src="https://cdn1.lncld.net/static/js/av-core-mini-0.6.1.js"></script>
<script>AV.initialize("rRxCAb8Kk2bhhTQJInFKaY4v-gzGzoHsz", "eEp5YWpvXhpv3Jvheh4bHCfG");</script>
<script>
    function showTime(test) {
        var query = new AV.Query(test);
        var entries = [];
        var $visitors = $(".leancloud_visitors");

        $visitors.each(function () {
            entries.push( $(this).attr("id").trim() );
        });

        query.containedIn('url', entries);
        query.find()
            .done(function (results) {
                var COUNT_CONTAINER_REF = '.leancloud-visitors-count';

                if (results.length === 0) {
                    $visitors.find(COUNT_CONTAINER_REF).text(0);
                    return;
                }

                for (var i = 0; i < results.length; i++) {
                    var item = results[i];
                    var url = item.get('url');
                    var time = item.get('time');
                    var element = document.getElementById(url);

                    $(element).find(COUNT_CONTAINER_REF).text(time);
                }
            })
            .fail(function (object, error) {
                console.log("Error: " + error.code + " " + error.message);
            });
    }

    function addCount(test) {
        var $visitors = $(".leancloud_visitors");
        var url = $visitors.attr('id').trim();
        var title = $visitors.attr('data-flag-title').trim();
        var query = new AV.Query(test);

        query.equalTo("url", url);
        query.find({
            success: function(results) {
                if (results.length > 0) {
                    var counter = results[0];
                    counter.fetchWhenSave(true);
                    counter.increment("time");
                    counter.save(null, {
                        success: function(counter) {
                            var $element = $(document.getElementById(url));
                            $element.find('.leancloud-visitors-count').text(counter.get('time'));
                        },
                        error: function(counter, error) {
                            console.log('Failed to save Visitor num, with error message: ' + error.message);
                        }
                    });
                } else {
                    var newcounter = new test();
                    /* Set ACL */
                    var acl = new AV.ACL();
                    acl.setPublicReadAccess(true);
                    acl.setPublicWriteAccess(true);
                    newcounter.setACL(acl);
                    /* End Set ACL */
                    newcounter.set("title", title);
                    newcounter.set("url", url);
                    newcounter.set("time", 1);
                    newcounter.save(null, {
                        success: function(newcounter) {
                            var $element = $(document.getElementById(url));
                            $element.find('.leancloud-visitors-count').text(newcounter.get('time'));
                        },
                        error: function(newcounter, error) {
                            console.log('Failed to create');
                        }
                    });
                }
            },
            error: function(error) {
                console.log('Error:' + error.code + " " + error.message);
            }
        });
    }

    $(function() {
        var test = AV.Object.extend("Counter");
        if ($('.leancloud_visitors').length == 1) {
            addCount(test);
        } else if ($('.leancloud_visitors').length > 1) {
            showTime(test);
        }
    });
</script>



<script>
    (function(){
        var bp = document.createElement('script');
        var curProtocol = window.location.protocol.split(':')[0];
        if (curProtocol === 'https') {
            bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
        }
        else {
            bp.src = 'http://push.zhanzhang.baidu.com/push.js';
        }
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(bp, s);
    })();
</script>

</body>

<script src="/js/getTitle.js"></script>
    <script>
        $(function(){
            var __warehouse=document.getElementById('warehouse');
            var __content=document.getElementById('post');
            var cus={
                'title':'none',
                'article':__content,
            };
            __warehouse.__newCc(cus);
        });
    </script>

</html>